Vue.component('vue-switch', {
    props: ['value','text'],
    data: function () {
        return {
            txt:['OFF','ON'],
            val:this.value||0, //0关闭，1打开
        }
    },
    mounted:function () {
        var arr = this.text.split('|');
        this.txt=arr;
    },
    methods:{
        toggle:function () {
            this.val=(this.val==0?1:0);
            this.$emit('input',this.val);
            this.$emit('toggle',this.val);
        }
    },
    watch: {
        value(val) {
            if (val !== 0 && val !== 1) {
                throw 'Value should be 1 or 0';
            }
            this.val = val;
        }
    },
    computed:{
        emStyle() {
            var that = this;
            return {
                'margin-right':that.val?'21px':'5px'
            }
        }
    },
    template: '<div @click="toggle" class="layui-unselect layui-form-switch" :class="{\'layui-form-onswitch\':val==1}" lay-skin="_switch"><em :style="emStyle">{{txt[val]}}</em><i></i></div>'
})